<!DOCTYPE html>
<html>
	<head lang="en">
		<meta charset="UTF-8">
		<title>京东轮播图</title>
		<style type="text/css">
			#tu{
				display: block;
				width: 300px;	
				margin: 0px auto;	
			}
			#father{
				position:relative;
				width: 300px;
				margin: 0px auto;
			}
			ul{
				list-style: none;
				position: absolute;
				bottom: -20px;
				left: 60px;
			}
			ul li{
				display: inline-block;
				background-color:yellow;
				color: white;
				width: 20px;
				height: 20px;
				border-radius:50% ;
				text-align: center;
			}
			#a{
				background-color:red;
			}
		</style>
	</head>
	<body>
		<div id="father">
		<img src="img/2/focus.jpg" id="tu" />
		<ul>
			<li id="a">1</li>
			<li>2</li>
			<li>3</li>
			<li>4</li>
			<li>5</li>
		</ul>
		</div>

	</body>
</html>
